import React from 'react'
class List extends React.Component {
    render() {
        console.log(this.props)
        const { list, chageATT, del } = this.props
        return (
         <div>
         {/* 评论列表 */}
         {list.map((item) => (
            <div className="comment-list" key={item.id}>
              <div className="list-item">
                <div className="user-face">
                  <img className="user-head" src={item.img} alt="" />
                </div>
                <div className="comment">
                  <div className="user">{item.author}</div>
                  <p className="text">{item.comment}</p>
                  <div className="info">
                    <span className="time">{item.time}</span>
                    <span
                      className={item.attitude === 1 ? 'like liked' : 'like'}
                      onClick={() => {
                        chageATT(item.id, 1)
                      }}>
                      <i className="icon" />
                    </span>
                    {/* className="hate hated" */}
                    <span
                      className={item.attitude === -1 ? 'hate hated' : 'hate'}
                      onClick={() => {
                        chageATT(item.id, -1)
                      }}>
                      <i className="icon" />
                    </span>
                    <span
                      className="reply btn-hover"
                      onClick={() => {
                        del(item.id)
                      }}>
                      删除
                    </span>
                  </div>
                </div>
              </div>

              {/* <div className="list-item">
              <div className="user-face">
                <img className="user-head" src="./images/avatar.png" alt="" />
              </div>
              <div className="comment">
                <div className="user">西西弗的守望</div>
                <p className="text">这个视频太好笑了</p>
                <div className="info">
                  <span className="time">2021-10-08 09:05:00</span>
                  <span className="like liked">
                    <i className="icon" />
                  </span>
                  <span className="hate hated">
                    <i className="icon" />
                  </span>
                  <span className="reply btn-hover">删除</span>
                </div>
              </div>
            </div> */}
            </div>
          ))}
        </div>
        )
    }
}
export default List